<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />			
		<link rel="stylesheet" type="text/css" href="<c:url value="/resources/styles/jquery-ui.css"/>" />
		<link rel="stylesheet" href="<c:url value="/resources/styles/springsource.css"/>" type="text/css"/>		
		<script type="text/javascript" src="<c:url value="resources/js/jquery-1.6.4.js"/>"></script>		
		<script type="text/javascript" src="<c:url value="resources/js/jquery-ui.js"/>"></script>

		<title><spring:message code="arf.title"/></title>
		
		<script type="text/javascript">
		
		$(document).ready(function() {	
			var rowcount = -1;
			/* var newRow = $("<tr>..."</tr>"); $("#mytable tbody").append(newRow); */ 
			
			$('.addlink').click(function(){
				rowcount++;
				//alert(rowcount);
				var org = "<tr><td><input id='beneficiaries"+rowcount+".name' name='beneficiaries["+rowcount+"].name' type='text' /><br/>" +	
						  "</td><td><input id='beneficiaries"+rowcount+".allocationPercentage' name='beneficiaries["+rowcount+"].allocationPercentage' type='text' /><br/></td></tr>";
				var str = $(org);
				
			   //alert(org);
			$('#beneficiaryTable').append(str);  
				return false;
				});
		});
		function addNewrow(){			
			
			//alert('hi');
		}
		
		</script>
	</head>	
	<body>	
		<div id="main_wrapper">		
			<h2><spring:message code="arf.title"/></h2	>			
			<form:form  commandName="accountRegistrationForm">
				<table>
				<c:if test="${accountRegistrationForm.formSubmissionStatus==true}">
					<tr><td class="infoText">
						<b><spring:message code="arf.form.submitted.successfully" /></b>
					</td></tr>
					<br/>
				</c:if>
				</table>
				<table style="width:70%;border:1px">	
					<tr>
						<td><spring:message code="arf.customer.name"/></td>
 						<td><form:input path="accountName"/>
 							<br/>
						    <form:errors path="accountName"  cssClass="error" /> 						
						</td>
					</tr>
								
					<tr>
						<td><spring:message code="arf.contact.number"/></td>						
						<td><form:input path="contactNumber"/>
							<br/>
						    <form:errors path="contactNumber"  cssClass="error" />
						</td>
					</tr>
					<tr>
						<td><spring:message code="arf.credit.card.number"/></td>
 						<td><form:input path="creditCardNumber"/>
							<br/>
						    <form:errors path="creditCardNumber"  cssClass="error" />
						</td>
					</tr>
					
					
					
					<tr><td colspan="2">
						<table id="beneficiaryTable">
							  <thead>
								    <tr>
										<td><spring:message code="arf.beneficiaries"/></td>
										<td align="right">
											<a href="#" class="addlink"><img  alt="Add" src="<c:url value="/resources/images/add-icon.png"/>" /></a>
											<a href="#" onclick="javascript:addNewrow()"><img  alt="Edit" src="<c:url value="/resources/images/gtk-edit.png"/>" /></a>
											<a href="#"><img  alt="Delete" src="<c:url value="/resources/images/icon-delete.png"/>" /></a> 
										</td>
									</tr>
									<tr>
										<td><spring:message code="arf.name"/></td>
										<td><spring:message code="arf.allocation.percentage"/></td>
									</tr>
								</thead>
								<tbody id='last'>
									<c:if test="${empty accountRegistrationForm.beneficiaries}">
										<tr><td class="infoText">
											<spring:message code="arf.add.instruction"/>
										</td></tr>
									</c:if>
									<c:forEach items="${accountRegistrationForm.beneficiaries}" var="beneficiary" varStatus="status">
										<tr>
											<td>
												<form:input path="beneficiaries[${status.index}].name"/>
												<br/>
												<form:errors path="beneficiaries[${status.index}].name"  cssClass="error" /></td>
										     <td><form:input path="beneficiaries[${status.index}].allocationPercentage"/>
												<br/>
												<form:errors path="beneficiaries[${status.index}].allocationPercentage"  cssClass="error" />
											</td>
										</tr>
									</c:forEach>
									
									<!-- <tr>
										<td>
												<input id="beneficiaries0.name" name="beneficiaries[0].name" type="text" value="Annabelle"/>
												<br/>												
										</td>
										<td>
												<input id="beneficiaries0.allocationPercentage" name="beneficiaries[0].allocationPercentage" type="text" value="50%"/>
												<br/>												
										</td>
									</tr> -->

								</tbody>
						</table>
					</td></tr>
					<tr>
						<td colspan='2'><input type="submit" value="<spring:message code="arf.save"/>"/>
						</td>
					</tr>
				</table>	
			</form:form>		
		</div>
	</body>
</html>
	
